<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>vue解析对象和数组</title>
		<script src="./js/vue.js"></script>
	</head>
	<body>
		<div id="app">
			<h2 v-for="(Array,index) in Array">{{index}}-{{Array.brand}}</h2>
			<h2>{{a.eat()}}</h2>
			<h2>{{a.age}}</h2> 
			<h2>{{a.name}}</h2>
			<h2>{{b.gender}}</h2>
			<h2>{{b.address}}</h2>
			<h2>{{Array[1].brand}}</h2>
			<h2>{{Array[2].color}}</h2>
			<button v-on:click="show()">v-on:click</button>
		</div>
		<script>
		
			new Vue({
				el:"#app",//挂载点
				data:{//数据区
					a:{//自定义对象
						name:"jack",
						age:15,
						eat:function(){
							alert("小动物吃啥都行")
						},
					},
					b:{
						gender:"男",
						address:"马家屯"
					},
					//数组
					Array:[{brand:"马自达",color:"红"},
					{brand:"奔驰",color:"黑"},{brand:"本田",color:"橙"}],
					methods:{
						show:function(){
							alert("好家伙!")
						}
					}
					
				}
			})
		</script>
	</body>
</html>
